<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="../../common/taglibs.jsp"%>
<!DOCTYPE html>
<html>
<head>
	<script type="text/javascript" src="${ctx}/static/js/jquery.js"></script>
	<script type="text/javascript" src="${ctx}/static/js/layer/layer.js"></script>
	<script type="text/javascript" src="${ctx}/static/js/jsrender.js"></script>
	<link rel="stylesheet" type="text/css" href="${ctx}/static/admin/css/admin.css"/>
	<link rel="stylesheet" href="${ctx}/static/js/jquery-table/css/jquery-table-admin.css" />
	<style>
		.file_button:hover{
			opacity: 0.7;
			filter: alpha(opacity=50);
			zoom: 1;
		}
	</style>
</head>
<body>
<input type="hidden" name="belong_module" value="FTN_AMD_USR_INFO_MGT"/>

 	 <title:get function="global.FTN_AMD_USR_INFO_MGT"/>

	<ol class="breadcrumb wzb-breadcrumb">
		<li>
			<a href="javascript:wb_utils_gen_home(true);">
				<i class="fa wzb-breadcrumb-home fa-home"></i>
				<lb:get key="label_lm.label_core_learning_map_1" />
			</a>
		</li>
		<li class="active">
		  <lb:get key="FTN_AMD_USR_MONITOR" /></a><!-- 监管学员管理 -->
		</li>
	</ol>
	<!-- wzb-breadcrumb End-->
<div class=" panel wzb-panel textleft panel-body wzb-main">
<table border="0" width="984" cellspacing="0">
	<tbody>
	<tr>
		<td style="border-bottom: 1px solid #ddd;">
			<ul id="monitor_tab" style="border-bottom:0;" role="tablist" class="nav nav-tabs page-tabs">
				<li id="tab1" class="active" role="presentation">
					<a href="#basic" data-toggle="tab" role="tab" aria-controls="basic">证件号码导入</a>
				</li>
				<li id="tab2" role="presentation" class="">
					<a href="#senior" data-toggle="tab" role="tab" aria-controls="senior">受监管学员导出</a>
				</li>
			</ul>
		</td></tr>
	</tbody>
</table>
<div class="tab-content">
	<div id="basic" class="tab-pane active" role="tabpanel">
		<table>
			<tbody>
			<tr style="height: 100px">
				<td width="80px" align="right">
					<div style="margin:-10px 0 0 0; height:0;font-weight: bold">
						1、Excel导入：
					</div>
				</td>
				<td width="300px" align="left">
					<div style="margin:2px 0 0 0; height:0;" class="file">
						<form id="upload" enctype="multipart/form-data" method="post" name="fileinfo" action="/app/admin/monitor/importMonitor">
							<input onchange="$(this).siblings('.file_txt').val(this.value);" type="file" name="uploadFile"
								   accept="application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
								   class="file_file"
								   id="file_photo_url"
								   style="width: 300px;"/>
							<input value='<lb:get key="no_select_file"/>' class="file_txt" style="width:300px;">
						</form>

						<div class="file_button-blue" style="border-radius: 4px; width: 60px;height: 28px;left: 250px" ><lb:get key="usr_browse"/></div>
					</div>
					<div class="file_button" style="cursor:hand;position: relative;background-color: #ff8c00;border-radius: 4px; width: 80px;height: 28px;left: 320px;"><a style="color: white;line-height: 25px;" download="filename" id="a_downloadexcel" href="/monitor/monitor.xlsx">文件模板</a></div>
					<input type="hidden" id="code" name="code" value="${code}">
					<input type="hidden" id="message" name="message" value="${message}">
					<input type="hidden" id="error" name="error" value="${error}">
					<input type="hidden" id="count" name="count" value="0">
				</td>
			</tr>
			<tr style="height: 50px">
				<td></td>
				<td align="left">
					<input style="color:#fff; background:#00aeef; border:none; border-radius: 4px;  width: 80px;height: 32px;" type="button" value="Excel导入" onclick="uploadFile()"/>
				</td>
			</tr>
			<tr style="height: 50px">
				<td width="80px" align="right">
					<div style="margin:2px 0 0 0; height:0;font-weight: bold">
						2、API接口：
					</div>
				</td>
				<td style="padding-top: 30px" align="left">
					<input style="color:#fff; background:#00aeef; border:none; border-radius: 4px;  width: 100px;height: 32px;" type="button" value="调用接口导入" onclick="faceCheck()"/>
				</td>
			</tr>
			<tr style="height: 150px"></tr>
			</tbody></table>
	</div>
	<div id="senior" class="tab-pane" role="tabpanel">
		<div class="panel-body">

			<form class="form-search" onsubmit="return false;">
				<input type="button" class="btn wzb-btn-yellow" value="<lb:get key="global.global_export"/>" onclick="batchExp();"><!-- 导出-->
			</form>
			<span id="liveList" class="datatable wzb-table-input"> </span>

		</div>
	</div>
	</div>
	<form enctype="multipart/form-data"></form>
</div>

<script type="text/javascript" src="${ctx}/static/js/i18n/${lang}/label_project_${lang}.js"></script>
<script type="text/javascript" src="${ctx}/js/tree/js/jquery.ztree.core.js"></script>
<script type="text/javascript" src="${ctx}/static/js/jquery-table/jquery.table.js"></script>
<script type="text/javascript" src="${ctx}/js/wb_application.js"></script>
<script type="text/javascript" src="${ctx}/static/admin/js/user/monitorUsers.js"></script>
<script id="text-template" type="text/x-jsrender">
	<span style="{{>style}}">{{>text}}</span>
</script>
<script id="input-template" type="text/x-jsrender">
  	<input type="checkbox" name="cms_checkbox" value="{{>text}}" />
</script>
<script type="text/javascript">
	var storage = window.localStorage;
	$(function () {
		$("#monitor_tab").on("click","li",function(){
			let id = $(this).attr("id")
			storage.setItem("active",id);
		})
		var code = $("#code").val();
		var message = $("#message").val();
		var error = $("#error").val();
		if ('200' == code) {
			storage.setItem("change",1);
			if (error) {
				layer.alert('部分用户导入失败,'+error);
			}else {
				layer.alert('导入成功！');
			}
		} else if ('201' == code) {
			layer.alert('导入失败！');
		} else if ("" != code) {
			layer.alert(message);
		}
		if(storage.getItem("active") == 'tab2'){
			$("#tab2").addClass('active')
			$("#senior").addClass('active')
			$("#tab1").removeClass('active')
			$("#basic").removeClass('active')
			if(storage.getItem("change") == 1){
				$(dt).reloadTable();
				storage.removeItem("change")
			}
		}else{
			$("#tab1").addClass('active')
			$("#basic").addClass('active')
			$("#tab2").removeClass('active')
			$("#senior").removeClass('active')
		}
	});
	function uploadFile() {
		var file = document.getElementById("file_photo_url").files[0];
		if (file == null) {
			layer.alert('请上传文件');
			return false;
		}
		var form = document.getElementById("upload");
		form.submit();
	}
</script>

</body>
</html>